<template>
    <div>
        <div v-if="!editing">
            {{rowData[field]}}
        </div>
        <div v-else>
            <el-select v-model="rowData[field]" filterable placeholder="请选择" v-if="optionNotObj !== undefined">
                <el-option v-for="item in options"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"></el-option>
            </el-select>
            <el-select v-model="rowData[value]" filterable placeholder="请选择" @change="changeFn" v-else>
                <el-option v-for="item in options"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"></el-option>
            </el-select>
        </div>
    </div>
</template>
<script>
    export default {
        name:'ui-tr-edit-select',
        props:{
            editing:{},
            rowData:{},
            field:{},
            value:{},
            options:{},
            optionNotObj:{}
        },
        data() {
            return {
                cacheOptions:[]
            }
        },
        mounted() {
            let _this = this;
            this.options.map(function(item) {
                _this.cacheOptions[item.value] = item.label
                return _this.cacheOptions[item.value]
            })
        },
        beforeDestroy() {

        },
        watch:{},
        methods:{
            changeFn(value) {
                this.rowData[this.field] = this.cacheOptions[value];
            }
        }
    }
</script>
